feat: demo custom transitions with Motion and el.animate - #1130

Summary

• Custom transition: Motion: the popmotion + stylefire demo is replaced with a spring transition from Motion (animate(from, to, { type: 'spring' })).
• Custom transition: el.animate (new, #custom-transition-el-animate): a custom transition with no library. Element.animate() can't animate scroll positions, so the element scrolls instantly and its content is animated with a transform from where it was (FLIP). Clicking a new button mid-animation carries on smoothly.
• Both demos share one component (ExampleCustomTransition) and show hand-written source, so the code shown isn't minified.
• Dependencies:
  • Removed popmotion and stylefire, added motion.
  • smooth-scroll-into-view-if-needed goes from ^1.1.33 to ^2.0.2 (the site was still on v1).
  • Raised the minimum versions of scroll-into-view-if-needed and compute-scroll-into-view.
• Fixes:
  • The footer GitHub link pointed to stipsan/ and now points to the scroll-into-view org.
  • Fixed the "scrollIntoVIew" typo.
  • Number literals in code samples rendered as grey pills because Bulma's .number class clashed with the highlighter's tokens.
• Updated the Cypress spec for both sections.

Testing

pnpm typecheck and pnpm build pass. I also checked in Chromium that both demos animate and end with the chosen emoji centered, for each button and both inline options.

Want tembo to make any changes? Add a comment with @tembo and i'll get back to work!